<template>
  <el-dialog
    :visible.sync="dialogVisible"
    title="流程 - 绑定角色"
    append-to-body
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :show-close="false"
    :before-close="beforeClose"
    class="tag-edit-dialog tag-similar-dialog"
    width="25%"
    v-loading="loading"
    v-dialogMove
  >
    <el-select v-model="roleId">
      <el-option label="---" :value="0"></el-option>
      <el-option v-for="item in roleList" :label="item.roleNm" :value="item.roleId" :key="item.roleId"></el-option>
    </el-select>
    <span slot="footer" class="dialog-footer">
      <el-button @click="beforeClose()">取消</el-button>
      <el-button type="primary" @click="submit">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      loading: false,
      dialogVisible: false,
      roleList: [],
      procId: '',
      nodeId: '',
      roleId: 0
    }
  },
  methods: {
    showDialog(params) {
      this.procId = params.procId
      this.nodeId = params.nodeId
      this.roleId = params.roleId
      this.getRoleList()
      this.dialogVisible = true
    },
    getRoleList() {
      this.$ajax({
        url: this.$ajax.setUrl('sys/sysRoleMgr/list'),
        method: 'get',
        params: this.$ajax.setParams()
      }).then(({ data }) => {
        if (data && data.code === '0') {
          this.roleList = data.data
        } else {
          this.$message.error(data.data || data.msg)
        }
      })
    },
    submit() {
      this.loading = true
      this.$ajax({
        url: this.$ajax.setUrl('sys/sysProcNodeRole'),
        method: 'post',
        data: this.$ajax.setData({
          nodeId: this.nodeId,
          procId: this.procId,
          roleId: this.roleId
        })
      }).then(({ data }) => {
        if (data && data.code === '0') {
          this.$message.success(data.msg)
          this.$emit('refresh')
          this.beforeClose()
        } else {
          this.$message.error(data.data || data.msg)
        }
        this.loading = false
      })
    },
    beforeClose() {
      this.roleList = []
      this.procId = ''
      this.nodeId = ''
      this.roleId = 0
      this.dialogVisible = false
    }
  }
}
</script>

<style lang="scss"></style>
